<template>
<onekit-page>
<onekit-view onekit-class="container">
	<div is="onekit-template-head" :DATA="`${JSON.stringify({title:'saveFile'})}`"></div>
	<onekit-view onekit-class="page-body">
		<onekit-view onekit-class="page-section">
			<onekit-view onekit-class="page-body-info">
				<template v-if="tempFilePath != ''">
					<onekit-image onekit-class="image" :src="tempFilePath" mode="aspectFit"></onekit-image>
				</template>
				<template v-if="((tempFilePath == '')) && ((savedFilePath != ''))">
					<onekit-image onekit-class="image" :src="savedFilePath" mode="aspectFit"></onekit-image>
				</template>
				<template v-if="((tempFilePath == '')) && ((savedFilePath == ''))">
					<onekit-view onekit-class="image-plus image-plus-nb" @click.native="chooseImage">
						<onekit-view onekit-class="image-plus-horizontal"></onekit-view>
						<onekit-view onekit-class="image-plus-vertical"></onekit-view>
					</onekit-view>
					<onekit-view onekit-class="image-plus-text">请选择文件</onekit-view>
				</template>
			</onekit-view>
			<onekit-view onekit-class="btn-area">
				<onekit-button type="primary" @Tap="saveFile">保存文件</onekit-button>
				<onekit-button @Tap="clear">删除文件</onekit-button>
			</onekit-view>
		</onekit-view>
	</onekit-view>
	<modal :title="dialog.title" :hidden="dialog.hidden" no-cancel @Confirm="confirm">{{dialog.content}}</modal>
	<div is="onekit-template-foot"></div>
</onekit-view>
</onekit-page></template>
<script>
/* eslint-disable */
import Vue from 'vue';
import onekit_template_0 from '../../../common/head.head.vue';Vue.component('onekit-template-head',onekit_template_0);
import onekit_template_1 from '../../../common/foot.foot.vue';Vue.component('onekit-template-foot',onekit_template_1);
const ONEKIT_JSON= {
  "navigationBarTitleText": "文件",
  "usingComponents": {
    
  }
};
const ONEKIT_SJS = {
};
import wx from '../../../../weixin2vue/wx.js';
import Macro from '../../../../weixin2vue/Macro.js';
const {getApp,getCurrentPages} = Macro;
import Page from '../../../../weixin2vue/OnekitPage.js';
import Component from '../../../../weixin2vue/OnekitComponent.js';
export default Page(ONEKIT_JSON,["tempFilePath","savedFilePath","dialog","title","hidden","content"],ONEKIT_SJS,{
    "onShareAppMessage"(){
      return {
        "title":'文件',
        "path":'packageAPI/pages/file/file'
};
    },
    "onLoad"(){
      this.setData({
        "savedFilePath":wx.getStorageSync('savedFilePath')
});
    },
    "data":{
        "tempFilePath":'',
        "savedFilePath":'',
        "dialog":{
            "hidden":true
}
},
    "chooseImage"(){
      const that = this;
      wx.chooseImage({
        "count":1,
        "success"(res){
          that.setData({
            "tempFilePath":res.tempFilePaths[0]
});
        }
});
    },
    "saveFile"(){
      if(this.data.tempFilePath.length > 0)
      {
        const that = this;
        wx.saveFile({
            "tempFilePath":this.data.tempFilePath,
            "success"(res){
              that.setData({
                "savedFilePath":res.savedFilePath
});
              wx.setStorageSync('savedFilePath',res.savedFilePath);
              that.setData({
                "dialog":{
                    "title":'保存成功',
                    "content":'下次进入应用时，此文件仍可用',
                    "hidden":false
}
});
            },
            "fail"(){
              that.setData({
                "dialog":{
                    "title":'保存失败',
                    "content":'应该是有 bug 吧',
                    "hidden":false
}
});
            }
});
      };
    },
    "clear"(){
      wx.setStorageSync('savedFilePath','');
      this.setData({
        "tempFilePath":'',
        "savedFilePath":''
});
    },
    "confirm"(){
      this.setData({
        "dialog.hidden":true
});
    }
});

</script>
<style 
 lang="css">
.image {
  width: 100% ;
  height: 330px ;
}
.page-body-info {
  display: flex ;
  box-sizing: border-box ;
  padding: 15px ;
  height: 410px ;
  border-top: 1px solid var(--weui-FG-3) ;
  border-bottom: 1px solid var(--weui-FG-3) ;
  align-items: center ;
  justify-content: center ;
}
</style>